<template>
	<view class="container container17782">
		<view class="flex flex-wrap diygw-col-24 items-center flex1-clz">
			<image src="/static/yh.png" class="diygw-image diygw-col-0 image-clz" style="height: 50px !important; width: 50px" mode="widthFix"></image>
			<view class="flex flex-wrap diygw-col-0 flex-direction-column items-start flex2-clz">
				<view class="diygw-col-0 text1-clz"> Arise.Ascendancy </view>
				<view class="flex flex-wrap diygw-col-0 items-center flex5-clz">
					<image src="/static/zshy.png" class="diygw-image diygw-col-0" style="height: 20px !important; width: 20px" mode="widthFix"></image>
					<view class="diygw-col-0"> 普通用户 </view>
				</view>
			</view>
			<text class="flex icon diygw-col-0 icon-clz diy-icon-right"></text>
		</view>
		<view class="flex flex-wrap diygw-col-24 flex-direction-column flex3-clz">
			<view class="diygw-col-0 text4-clz"> 个人信息 </view>
			<view class="flex diygw-col-24">
				<view class="diygw-grid col-3">
					<view class="diygw-grid-item">
						<view class="diygw-grid-inner grid-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/qb1.png"></image>
							</view>
							<view class="diygw-grid-title"> 我的钱包 </view>
						</view>
					</view>
					<view @tap="navigateTo" data-type="page" data-url="/pages/data" class="diygw-grid-item">
						<view class="diygw-grid-inner grid-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/plpj.png"></image>
							</view>
							<view class="diygw-grid-title"> 信息查询 </view>
						</view>
					</view>
					<view class="diygw-grid-item">
						<view class="diygw-grid-inner grid-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/kf.png"></image>
							</view>
							<view class="diygw-grid-title"> 成绩分析 </view>
						</view>
					</view>
				</view>
			</view>
			<view class="flex diygw-col-24">
				<diy-noticebar class="flex1 diy-notice-bar" color="#07c160" bgColor="#fff" leftIcon="diy-icon-notification">
					<block v-slot:content>
						<text class="diy-notice-item"> 信息公告，走过路过，千万不要错过！ </text>
					</block>
				</diy-noticebar>
			</view>
		</view>
		<view class="flex flex-wrap diygw-col-24 flex-direction-column flex4-clz">
			<view class="diygw-col-0 text3-clz"> 我的发布 </view>
			<view class="flex diygw-col-24">
				<view class="diygw-grid col-4">
					<view class="diygw-grid-item">
						<view class="diygw-grid-inner grid2-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid2-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/bj.png"></image>
							</view>
							<view class="diygw-grid-title"> 发布 </view>
						</view>
					</view>
					<view class="diygw-grid-item">
						<view class="diygw-grid-inner grid2-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid2-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/xh.png"></image>
							</view>
							<view class="diygw-grid-title"> 想做 </view>
						</view>
					</view>
					<view class="diygw-grid-item">
						<view class="diygw-grid-inner grid2-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid2-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/dz2.png"></image>
							</view>
							<view class="diygw-grid-title"> 点赞 </view>
						</view>
					</view>
					<view class="diygw-grid-item">
						<view class="diygw-grid-inner grid2-item-clz">
							<view class="diygw-grid-icon diygw-avatar grid2-icon-clz">
								<image mode="aspectFit" class="diygw-avatar-img" src="/static/ls.png"></image>
							</view>
							<view class="diygw-grid-title"> 足迹 </view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="flex flex-wrap diygw-col-24 flex-direction-column flex6-clz">
			<view class="flex flex-wrap diygw-col-24 items-center flex7-clz">
				<view class="diygw-col-0 text7-clz"> 设置 </view>
				<text class="flex icon3 diygw-col-0 diy-icon-right"></text>
			</view>
		</view>
		<view class="diygw-col-24 text2-clz"> Copyright Arise © 2021-2023 </view>
		<view class="flex diygw-col-24 diygw-bottom olive bar-clz">
			<view class="diygw-grid diygw-actions">
				<button @tap="navigateTo" data-type="page" data-url="/pages/Home" class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar diy-icon-home" style="color: #ffffff"> </view>
						<view class="diygw-grid-title"> 首页 </view>
					</view>
				</button>
				<button @tap="navigateTo" data-type="page" data-url="/pages/data" class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar diy-icon-discover" style="color: #ffffff"> </view>
						<view class="diygw-grid-title"> 数据信息 </view>
					</view>
				</button>
				<button @tap="navigateTo" data-type="page" data-url="/pages/vip" class="diygw-action addon">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar diy-icon-people" style="color: #ffffff"> </view>
						<view class="diygw-grid-title"> 用户中心 </view>
					</view>
				</button>
			</view>
		</view>
		<view class="version text-grey flex-direction-column flex diygw-col-24 justify-center align-center">
			<view> DIY官网代码生成器生成 </view>
			<view> http://www.diygw.com </view>
		</view>
		<view class="clearfix"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				//用户全局信息
				userInfo: {},
				//页面传参
				globalOption: {},
				//自定义全局变量
				globalData: {}
			};
		},
		onShow() {
			this.setCurrentPage(this);
		},
		onLoad(option) {
			this.setCurrentPage(this);
			if (option) {
				this.setData({
					globalOption: this.getOption(option)
				});
			}

			this.init();
		},
		methods: {
			async init() {}
		}
	};
</script>

<style lang="scss" scoped>
	.flex1-clz {
		margin-left: 10px;
		width: calc(100% - 10px - 10px) !important;
		margin-top: 10px;
		margin-bottom: 0px;
		margin-right: 10px;
	}
	.image-clz {
		margin-left: 5px;
		border: 1px solid rgba(240, 240, 240, 0.17);
		border-bottom-left-radius: 30px;
		box-shadow: 0px 1px 3px rgba(242, 242, 242, 0.49);
		overflow: hidden;
		border-top-left-radius: 30px;
		margin-top: 0px;
		border-top-right-radius: 30px;
		border-bottom-right-radius: 30px;
		margin-bottom: 0px;
		margin-right: 5px;
	}
	.flex2-clz {
		flex: 1;
	}
	.text1-clz {
		margin-left: 0px;
		font-weight: bold;
		font-size: 16px !important;
		margin-top: 0px;
		margin-bottom: 5px;
		text-align: center;
		margin-right: 0px;
	}
	.flex5-clz {
		background-color: #dbe4e9;
		padding-top: 0px;
		border-bottom-left-radius: 20px;
		overflow: hidden;
		padding-left: 0px;
		padding-bottom: 0px;
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
		border-bottom-right-radius: 20px;
		padding-right: 3px;
	}
	.icon-clz {
		color: #979797;
	}
	.icon {
		font-size: 17px;
	}
	.flex3-clz {
		padding-top: 10px;
		border-bottom-left-radius: 8px;
		padding-left: 10px;
		padding-bottom: 10px;
		border-top-right-radius: 8px;
		margin-right: 10px;
		background-color: #ffffff;
		margin-left: 10px;
		box-shadow: 0px 0px 18px rgba(142, 137, 137, 0.24);
		overflow: hidden;
		width: calc(100% - 10px - 10px) !important;
		border-top-left-radius: 8px;
		margin-top: 15px;
		border-bottom-right-radius: 8px;
		margin-bottom: 0px;
		padding-right: 10px;
	}
	.text4-clz {
		font-weight: bold;
		flex: 1;
		font-size: 14px !important;
	}
	.grid-item-clz {
		font-size: 12px;
		margin: 0px;
		padding: 10px;
	}
	.grid-icon-clz {
		width: 40px;
		height: 40px;
		font-size: calc(40px - 4px) !important;
	}
	.flex4-clz {
		padding-top: 10px;
		border-bottom-left-radius: 8px;
		padding-left: 10px;
		padding-bottom: 10px;
		border-top-right-radius: 8px;
		margin-right: 10px;
		background-color: #ffffff;
		margin-left: 10px;
		box-shadow: 0px 0px 18px rgba(142, 137, 137, 0.24);
		overflow: hidden;
		width: calc(100% - 10px - 10px) !important;
		border-top-left-radius: 8px;
		margin-top: 15px;
		border-bottom-right-radius: 8px;
		margin-bottom: 0px;
		padding-right: 10px;
	}
	.text3-clz {
		font-weight: bold;
		flex: 1;
		font-size: 14px !important;
	}
	.grid2-item-clz {
		font-size: 12px;
		margin: 0px;
		padding: 10px;
	}
	.grid2-icon-clz {
		width: 30px;
		height: 30px;
		font-size: calc(30px - 4px) !important;
	}
	.flex6-clz {
		padding-top: 15px;
		border-bottom-left-radius: 8px;
		padding-left: 10px;
		padding-bottom: 15px;
		border-top-right-radius: 8px;
		margin-right: 10px;
		background-color: #ffffff;
		margin-left: 10px;
		box-shadow: 0px 0px 18px rgba(142, 137, 137, 0.24);
		overflow: hidden;
		width: calc(100% - 10px - 10px) !important;
		border-top-left-radius: 8px;
		margin-top: 15px;
		border-bottom-right-radius: 8px;
		margin-bottom: 0px;
		padding-right: 10px;
	}
	.text7-clz {
		font-weight: bold;
		flex: 1;
		font-size: 14px !important;
	}
	.icon3 {
		font-size: 16px;
	}
	.text2-clz {
		margin-left: 5px;
		color: #b6b6b6;
		width: calc(100% - 5px - 5px) !important;
		margin-top: 25px;
		margin-bottom: 5px;
		text-align: center;
		margin-right: 5px;
	}
	.bar-clz {
		color: #fefefe;
	}
	.container17782 {
		padding-left: 0px;
		padding-right: 0px;
		background-color: #f4f4f4;

		font-size: 12px;
	}
	.container17782 {
		padding-bottom: 80px;
	}
</style>
